<template>
	<view class="page1">
		<scroll-view scroll-y="true" style="height: 100%;" :lower-threshold="60">
		<image class="iwidth" :src="imgPath+'/static/big/teamList/teamList.png'" mode="widthFix"></image>
		<!-- <view class="rules" @click="rules"></view> -->
		<!-- <view class="back_btn" @click="rightClick"></view>
		<view class="go_btn" @click="goPh"></view> -->
		<view class="tdName">{{mbtiTeam.teamName}}</view>
		<view class="tdDz">{{mbtiTeam.voteNumber}}</view>
		<view class="tdPm">{{mbtiTeam.ranking}}</view>

	<button class="yqShare" open-type="share" id='2'>
		<image class="yqImage" mode="widthFix" :src="imgPath+'/static/big/teamList/dianzan.png'"></image>
	</button>
	<image class="mbiImage" @click="goResult" mode="widthFix" :src="imgPath+'/static/big/teamList/myMbi.png'"></image>

		<view class="square">
			<view class="top-box">
				<scroll-view scroll-y="true" style="height: 100%;" @scrolltolower="goBottom" :lower-threshold="60">
					<view class="top-content">
						<view class="item-top" v-for="(v, i) in mbtiTeam.members" :key="v.userId" :style="{'padding-left': mbtiTeam.members.length == 9 && i == 0 ?'70rpx' : '0'}">
							<view style="display: flex;justify-content: center;">
								<view v-if="v.isCaptain == 1" class="item-tag">队长</view>
								<view class="item-tag1">{{v.mbti}}</view>
							</view>
							<image class="pImage" :src="v.avatar" mode="widthFix"></image>
							<view class="item-name">{{v.nickname}}</view>
						</view>
					</view>
				</scroll-view>
			</view>
			<view class="tabs">
				<view>
					<image class="rw" mode="widthFix" v-if="!renwuAction" @click="renwu" :src="imgPath+'/static/big/teamList/rw.png'"></image>
					<image class="rw" mode="widthFix" v-else @click="renwu" :src="imgPath+'/static/big/teamList/rw1.png'"></image>
				</view>
				<view>
					<image class="xd" mode="widthFix" v-if="!xiaoduiAction"  @click="xiaodui" :src="imgPath+'/static/big/teamList/xd.png'"></image>
					<image class="xd" mode="widthFix" v-else  @click="xiaodui" :src="imgPath+'/static/big/teamList/xd1.png'"></image>
				</view>
			</view>
			<image v-if="!start" class="tsImage" mode="widthFix" :src="imgPath+'/static/big/teamList/ts0.png'"></image>
			<image v-if="start" class="tsImage" mode="widthFix" :src="imgPath+'/static/big/teamList/ts1.png'"></image>

			<view class="wcJd" v-if="renwuAction">
				<view class="jdName">完成进度：</view>
				<image class="jdImage" mode="widthFix" :src="imgPath+'/static/big/teamList/jd.png'"></image>
				<view class="item-jd">
					<view class="item-jdbg" :style="{width: bl+'%'}"></view>
					<view class="item-jdnum" :style="{'left': bl >= 13 ? 'calc('+ bl + '% - 60rpx)': '0.5%'}">{{bl}}%</view>
				</view>
			</view>
			<view class="bottom-box" v-if="renwuAction">
				<view class="content">
					<view class="item" v-for="(v,index) in mbtiTeam.teamTasks" :key="v.id">
						<view class="xuhao">0{{ index+1 }}</view>
						<image class="itemList" mode="widthFix" :src="imgPath+'/static/big/teamList/rw/'+ v.taskKey + '.png'"></image>
						<image class="dagou" v-if="v.status == 2" mode="widthFix" :src="imgPath+'/static/big/teamList/dagou.png'"></image>
						<image class="kuang" mode="widthFix" :src="imgPath+'/static/big/teamList/kuang.png'"></image>
						<button class="pingzheng" :class="!start? 'huise': ''" open-type="share" v-if="v.taskKey == 'work_20' && v.status == 1" id='1'>
							<image class="pingzheng" :class="!start? 'huise': ''" :style="{top: 0, left: 0}" mode="widthFix" :src="imgPath+'/static/big/teamList/qyq.png'" @click="scRw(v)"></image>
						</button>
						<image v-if="v.status == 1 && v.taskKey == 'work_17'" class="pingzheng" mode="widthFix" :src="imgPath+'/static/big/teamList/qqd.png'" :class="!start? 'huise': ''" @click="scRw(v)"></image>
						<image v-if="!start && v.taskKey != 'work_17' && v.taskKey != 'work_20'" class="pingzheng" mode="widthFix" :src="imgPath+'/static/big/teamList/wancheng0.png'"></image>
						<image v-if="start && v.status == 1 && v.taskKey != 'work_20' && v.taskKey != 'work_17'" class="pingzheng" mode="widthFix" :src="imgPath+'/static/big/teamList/wancheng1.png'" @click="scRw(v)"></image>
						<image v-if="start && v.status == 2" class="pingzheng" mode="widthFix" :src="imgPath+'/static/big/teamList/wancheng2.png'"></image>

					</view>
				</view>
			</view>
			<view class="bottom-box" :style="{top: '800rpx'}"  v-if="xiaoduiAction">
				<scroll-view scroll-y="true" style="height: 100%;" @scrolltolower="goBottom" :lower-threshold="60">
					<view class="item-bottom" v-for="(v,i) in kjDetail" :key="i">
						<view class="item-name">{{v.teamName}}</view>
						<view class="item-time">{{v.createTime}}</view>
						<view class="item-msg">{{v.title}}</view>
						<!-- <view class="item-video" v-if="i == 0 && kjDetail.length > 0">
							<image class="my-video" :src="imagePath" mode="aspectFill" @click="preImage([imagePath])"></image>
						</view> -->
						<view style="display: flex;flex-wrap: wrap" v-if="v.files && getType(v.taskKey) == 1">
							<image v-for="s in v.files" :key="s" class="pImage" :src="s" mode="aspectFill" @click="preImage(v.files)"></image>
						</view>
						<view class="item-video" v-if="v.files && getType(v.taskKey) == 2">
							<video class="my-video" id="myVideo" :src="v.files[0]" :poster="v.files[0]+'?x-oss-process=video/snapshot,t_1000,f_jpg,w_328,h_305'" @play="playing"
							@error="videoErrorCallback" controls></video>
					 </view>
					</view>
				</scroll-view>
			</view>
		</view>
		<image @click="goXh" class="xhImage" mode="widthFix" :src="imgPath+'/static/big/teamList/xh.png'"></image>
		</scroll-view>
		<u-popup v-model="dzShow"  mode="center" :mask-close-able="false">
			<view style="position: relative;" v-if="isQdOk">
				<image class="dzImage" mode="widthFix" :src="imgPath+'/static/big/teamList/qdOk.png'"></image>
				<view class="tk-cancel" @click="dzShow = false"></view>
			</view>
			<view style="position: relative;" v-if="isDzOk">
				<image class="dzImage" mode="widthFix" :src="imgPath+'/static/big/teamList/dzOk.png'"></image>
				<view class="tk-cancel" @click="dzShow = false"></view>
			</view>
			<view style="position: relative;" v-if="isRwOk">
				<image class="dzImage" mode="widthFix" :src="imgPath+'/static/big/teamList/rwOk.png'"></image>
				<view class="tk-cancel" @click="dzShow = false"></view>
			</view>
			<view style="position: relative;height: 696rpx;overflow: hidden;" v-if="isImage || isVideo">
				<image class="scImage" mode="widthFix" :src="imgPath+'/static/big/teamList/scTk.png'"></image>
				<view class="scImageBox">
					<scroll-view scroll-y="true" :class="taskKey == 'work_2'? 'canScroll' : ''" :lower-threshold="60">
						<view v-if="isImage" class="scImageContent">
								<view v-for="(v, i) in images" v-show="i<9" :key="v" class="item-box" >
									<image class="scImage-item" mode="aspectFill" :src="v"></image>
									<image class="scImage-close" mode="widthFix" :src="imgPath+'/static/big/teamList/scX.png'" @click="delet(i)"></image>
								</view>
								<image class="scImage-add" mode="widthFix" :src="imgPath+'/static/big/teamList/scTj.png'" @click="scRwMore('image')" v-if="images.length < 9 "></image>
						</view>
					</scroll-view>
					<input v-if="taskKey == 'work_2'" class="search-name" v-model="inputValue" placeholder="输入对方的队伍名" />
					<view class="make-btn" v-if="isImage" @click="makeOk('isImage')"></view>
					<view class="video-box" v-if="isVideo">
						<video class="scImage-video" id="myVideo" v-if="video" :src="video" @play="playing"
						@error="videoErrorCallback" controls></video>
						<image class="scImage-close" v-if="video" mode="widthFix" :src="imgPath+'/static/big/teamList/scX.png'" @click="delet(i, 'video')"></image>
						<image class="scImage-add" mode="widthFix" :src="imgPath+'/static/big/teamList/scTj.png'" @click="scRwMore('video')" v-if="isVideo && !video"></image>
					</view>
					<view class="make-btn" v-if="isVideo" @click="makeOk('isVideo')"></view>
				</view>
				<image class="tk-cancel2" @click="dzShow = false" mode="widthFix" src="/static/close.png"></image>
			</view>
      <view style="position: relative;" v-if="isQd" class="qdBox">
				<image class="qdImage" mode="widthFix" :src="imgPath+'/static/big/teamList/qd.png'"></image>
				<view class="qd-txt">今日已签到成员({{qdDetail.signInData.length}}/{{mbtiTeam.memberNumber}})</view>
				<view class="qdImageBox">
					<view v-if="qdDetail.signInData.length == 0" style="margin: auto;">今日暂无人签到</view>
					<scroll-view v-else scroll-x="true" scroll-y="false" :lower-threshold="60" style="width: 100%; height: 100%;white-space: nowrap">
						<image v-for="(v) in qdDetail.signInData" :key="v" class="qdImage-item" mode="widthFix" :src="v.avatar"></image>
					</scroll-view>
				</view>

				<view class="qd-day">{{qdDetail.dayNumber}}</view>
				<view class="qd-day-box">
					<view v-for="v in [1,2,3]" :key="v" class="qd-item" :class="qdDetail.dayNumber >= v ? 'chose' : ''">+{{v}}</view>
				</view>
				<image class="qdImage-ok" mode="widthFix" :src="imgPath+'/static/big/teamList/qd0.png'" @click="makeOk('isQd')"></image>
				<view class="qdImage-cancel" @click="dzShow = false"></view>
			</view>
		</u-popup>

		<!--生成海报后的图  -->
		<view class="canvas-box" style="opacity: 0;height: 0;overflow: hidden;">
			<canvas canvas-id="mycanvas" style="width: 576rpx;height: 1105rpx;position:absolute;left:-1000rpx;" />
		</view>
		<NewRule/>
		<BgMusic ref="bgMusic"/>
		<ActivityEnd ref="activityEnd"/>
	</view>
</template>

<script>
	import platform from "@/src/platform";
	import http from "@/src/http";
	import { saveImage } from "./saveImage";
	export default {
		mixins: [saveImage],
		data() {
			return {
				teamId: '',
				stage: '',
				userBool:false,
				current: 0,
				list: [1,2,3,4,5,6,7],
				dzShow: false,
				showRules: false,
				renwuAction: true,
				xiaoduiAction: false,
				bl: 0,
				images: [],
				isVideo: false,
				isImage: false,
				isQd: true,
				isQdOk: false,
				isDzOk: false,
				isRwOk: false,
				isInput: false,
				video: '',
				inputValue: '',
				mbtiTeam: {},
				mbtiUser: {},
				qdDetail: {
					dayNumber: 2,
					signInData: []
				},
				kjDetail: [],
				taskKey: '',
				num: 1,
				start: false,
				isEnd: false
			}
		},
		components:{},
		async onLoad(options) {
		},
		async onShow() {
			await platform.getUserInfo()
			await this.loadData()
			this.getTeamList()
		},
		methods: {
			loadData(){
				return http.initData().then(res=>{
					if (res.data.task20AlertStatus && res.data.config.stage != 3) {
						this.dzShow = true
						this.isDzOk = true
					}
					res = res.data
					this.teamId = res.mbtiUser.teamId
					// 活动阶段 0=未开始 1=组队期 2=任务期 3=任务期结束
					this.stage = res.config.stage
					if (this.stage >= 2) {
						this.start = true
					} else {
						this.start = false
					}
					if (this.stage == 3) {
						this.isEnd = true
						this.$refs.activityEnd.show()
					} else {
						this.isEnd = false
					}
				})
			},
			getTeamList() {
				const params = {
					action: 'view',
					teamId: this.teamId
				}
				http.teamManage(params).then(res=>{
					this.mbtiTeam = res.data.mbtiTeam
					this.mbtiUser = res.data.mbtiUser
					this.bl = Number(res.data.mbtiTeam.taskProgress)
					// 如果没有队员生成图片，则调用生成图片
					if(!this.mbtiTeam.tasksPic){
						this.mainPic = '/static/img/rw/baocun.png'
						this.txt = this.mbtiTeam.teamName
						let images = []
						if (this.mbtiTeam.teamTasks.length > 0) {
							const small = ['work_24', 'work_23', 'work_18','work_17','work_15','work_13','work_12', 'work_11', 'work_9','work_7', 'work_5', 'work_2','work_1']
							images = this.mbtiTeam.teamTasks.map((v) => {
								return {
									"src": '/static/img/rw/'+ v.taskKey +'.png',
									"size": small.includes(v.taskKey) ? 94 : 114
								}
							})
						}
						this.imageList = [
							[
								'/static/img/rw/01.png',
								'/static/img/rw/02.png',
								'/static/img/rw/03.png',
								'/static/img/rw/04.png',
								'/static/img/rw/05.png',
								'/static/img/rw/06.png'
							],
							images
						]
						this.formSubmit()
					}
				})
			},
			getQd() {
				http.taskDetail().then(res=>{
					this.qdDetail = res.data
				})
			},
			getKj() {
				http.teamSpace({teamId: this.teamId}).then(res=>{
					this.kjDetail = res.data
				})
			},
			goResult() {
				uni.redirectTo({
					url:'/pages/activeB/result/index'
				});
			},
			goXh(){
				if (getCurrentPages().length >= 10) {//判断当前页面栈是否大于等于10.如果大于或等于就使用wx.redirectTo来跳转页面，清除当前页面栈
					uni.redirectTo({
						url:'/pages/activeB/square/index'
					});
				} else {
					uni.navigateTo({
						url:'/pages/activeB/square/index'
					});
				}
			},
			playing() {
				this.$refs.bgMusic.stop()
			},
			getEwm(){
				const env_version = process.env.NODE_ENV != 'production' ? 'trial' : 'release'
				console.log(process.env.NODE_ENV)
				http.qrCode({scene: 'id=111', width: 280, page: 'pages/index',env_version: env_version }).then(res=>{
					this.mainPic = this.imgPath + '/static/big/result/INFP.png'
					this.erPic = 'data:image/png;base64,'+ res.data
					this.topPic = this.imgPath + '/static/big/square/heng.png'
					this.bottomPic = this.imgPath + '/static/big/result/bcbottom.png'
					this.avatar = this.imgPath + '/static/big/result/INFP.png'
					this.txt = "wang大力大力大力大力"
					this.formSubmit()
				})
			},
			renwu(){
				if(!this.renwuAction){
					this.renwuAction = true
					this.xiaoduiAction = false
					this.getTeamList()
				}
			},
			xiaodui(){
				if(!this.xiaoduiAction){
					this.xiaoduiAction = true
					this.renwuAction = false
					this.getKj()
				}
			},
			confirmBtn1(){
				this.$refs.rules.regBool = false
			},
			rules(){
				this.$refs.rules.regBool = true
			},
			goPh(){
				uni.navigateTo({
					url:'/pages/activeB/leaderboard/index'
				});
			},
			rightClick(){
				uni.navigateBack()
			},
			getType(taskKey) {
				const map = {
					    tasks:1,
						work_1: 1,
						work_3: 1,
						work_5: 1,
						work_7: 1,
						work_9: 1,
						work_11: 1,
						work_12: 1,
						work_13: 1,
						work_18: 1,
						work_21: 1,
						work_22: 1,
						work_23: 1,
						work_4: 1,
						work_15: 1,
						work_10: 1,
						work_2: 1,
						work_24: 1,
						work_6: 2,
						work_8: 2,
						work_14: 2,
						work_16: 2,
						work_19: 2,
						work_25: 2,
						work_17: 3,
						work_20: 4
				}
				console.log(map[taskKey])
				return map[taskKey];
			},
			scRw(val) {
				if(this.isEnd == true){
					this.$refs.activityEnd.show()
					return
				}
				const type = this.getType(val.taskKey)
				if (val.taskKey === 'work_2') {
					this.isInput = true
				} else {
					this.isInput = false
				}
				if (['work_4', 'work_15', 'work_10', 'work_24'].includes(val.taskKey)) {
					this.num = 9
				} else {
					this.num = 1
				}
				this.images = []
				this.video = ''
				this.inputValue = ''
				if (type == 1) {
					const length = this.images.length
					uni.chooseImage({
						count: 9-length, //默认9
						success: async (chooseImageRes) => {
							const tempFilePaths = chooseImageRes.tempFilePaths;
							uni.showLoading({
								title:'上传中'
							});
							let avatar = await platform.uploadMuti(tempFilePaths)
							uni.hideLoading();
							this.images = this.images.concat(avatar)
							this.reset()
							this.dzShow = true
							this.isImage = true
							this.taskKey = val.taskKey
						}
					});
				}
				if (type == 2) {
					uni.chooseVideo({
						sourceType: ['album'],
						success: async (chooseImageRes) => {
							const tempFilePaths = chooseImageRes.tempFilePath;
							console.log(chooseImageRes.duration > 120, val.taskKey === 'work_6')
							if (val.taskKey === 'work_6' && chooseImageRes.duration > 120) {
								this.$u.toast('时长超过-视频时长超过限制，请重新上传;')
								return
							}
							if (val.taskKey === 'work_6' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}
							if (val.taskKey === 'work_8' && chooseImageRes.duration	> 60) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (val.taskKey === 'work_14' && chooseImageRes.duration > 120) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (val.taskKey === 'work_14' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}

							if (val.taskKey === 'work_16' && chooseImageRes.duration > 120) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (val.taskKey === 'work_16' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}
							if (val.taskKey === 'work_19' && chooseImageRes.duration > 120) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (val.taskKey === 'work_19' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}

							if (val.taskKey === 'work_25' && chooseImageRes.duration > 120) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (val.taskKey === 'work_25' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}
							uni.showLoading({
								title:'上传中'
							});
							let avatar = await platform.uploadFileVideo(tempFilePaths);
							uni.hideLoading();
							this.video = avatar
							this.reset()
							this.isVideo = true
							this.dzShow = true
							this.taskKey = val.taskKey
						}
					});
				}
				if (type == 3) {
					this.reset()
					this.isQd = true
					this.dzShow = true
					this.taskKey = val.taskKey
					this.getQd()
				}
				if (type == 4) {
					this.reset()
					this.taskKey = val.taskKey
				}
			},
			scRwMore(type) {
				if (type == 'image') {
					const length = this.images.length
					console.log(length)
					uni.chooseImage({
						count: 9-length, //默认9
						success: async (chooseImageRes) => {
							const tempFilePaths = chooseImageRes.tempFilePaths;
							console.log(tempFilePaths)
							uni.showLoading({
								title:'上传中'
							});
							let avatar = await platform.uploadMuti(tempFilePaths)
							uni.hideLoading();
							this.images = this.images.concat(avatar)
							this.reset()
							this.dzShow = true
							this.isImage = true
						}
					});
				}
				if (type == 'video') {
					uni.chooseVideo({
						sourceType: ['album'],
						success: async (chooseImageRes) => {
							const tempFilePaths = chooseImageRes.tempFilePath;
							if (this.taskKey === 'work_6' && chooseImageRes.duration > 120) {
								this.$u.toast('时长超过-视频时长超过限制，请重新上传;')
								return
							}
							if (this.taskKey === 'work_6' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}
							if (this.taskKey === 'work_8' && chooseImageRes.duration	> 60) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (this.taskKey === 'work_14' && chooseImageRes.duration > 120) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (this.taskKey === 'work_14' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}

							if (this.taskKey === 'work_16' && chooseImageRes.duration > 120) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (this.taskKey === 'work_16' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}
							if (this.taskKey === 'work_19' && chooseImageRes.duration > 120) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (this.taskKey === 'work_19' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}

							if (this.taskKey === 'work_25' && chooseImageRes.duration > 120) {
								this.$u.toast('视频时长超过限制，请重新上传;')
								return
							}
							if (this.taskKey === 'work_25' && chooseImageRes.duration < 60) {
								this.$u.toast('视频时长不足，请重新上传')
								return
							}
							uni.showLoading({
								title:'上传中'
							});
							let avatar = await platform.uploadFileVideo(tempFilePaths);
							uni.hideLoading();
							this.video = avatar
							this.reset()
							this.isVideo = true
							this.dzShow = true
						}
					});
				}
			},
			videoErrorCallback(e) {
			},
			delet(i, type) {
				if (type == 'video') {
					this.video = ''
				} else {
					this.images.splice(i, 1)
				}
			},
			makeOk(type) {
				if (type == 'isQd') {
					http.submitTask({taskKey: this.taskKey}).then((res) => {
						if (res.status == 0) {
							this.reset()
							http.taskDetail().then(res2=>{
								if (res2.data.dayNumber == 3) {
									this.isQdOk = true
								} else {
									this.dzShow = false
									this.$u.toast('签到成功')
								}
							})
							this.getTeamList()
						} else {
							this.$u.toast(res.message)
						}
					})
				}
				if (type == 'isImage') {
					if (this.num == 1) {
						if (this.images.length > 9 || this.images.length < 1) {
							this.$u.toast('请选择1-9张图片')
							return
						}
					}
					if (this.num == 9) {
						if (this.images.length > 9 || this.images.length < 3) {
							this.$u.toast('请选择3-9张图片')
							return
						}
					}
					if (this.taskKey == 'work_2') {
						if (!this.inputValue) {
							this.$u.toast('请输入对方的队伍名')
							return
						}
					}
					let params = {
						taskKey: this.taskKey,
						files: this.images,
					}
					if (this.taskKey == 'work_2') {
						params = {...params, ...{otherTeamName: this.inputValue}}
					}
					http.submitTask(params).then((res) => {
					if (res.status == 0) {
							this.getTeamList()
							this.reset()
							this.isRwOk = true
						} else {
							this.$u.toast(res.message)
						}
					})
				}
				if (type == 'isVideo') {
					const params = {
						taskKey: this.taskKey,
						files: [this.video]
					}
					http.submitTask(params).then((res) => {
					if (res.status == 0) {
						  this.getTeamList()
							this.reset()
							this.isRwOk = true
						} else {
							this.$u.toast(res.message)
						}
					})
				}
			},
			reset() {
				this.isImage = false
				this.isVideo = false
				this.isQd = false
				this.isQdOk = false
				this.isDzOk = false
				this.isRwOk = false
				this.isInput = false
			},
			goBottom(...e) {
			},
			preImage(res) {
				uni.previewImage({
					indicator:'number',
					urls: res,
				});
			}
		},
		onShareAppMessage(res) {
			http.writeLog2({type:2});
			let params = encodeURIComponent(`/pages/activeB/squadspace/index?teamId=${this.teamId}&taskKey=${this.taskKey}`)
			let title = ''
			if (res.from === 'button') {// 来自页面内分享按钮
				if (res.target.id == '2') {
					params = encodeURIComponent(`/pages/activeB/squadspace/index?teamId=${this.teamId}`)
					title = `${this.mbtiTeam.teamName}队正在火热挑战任务中，快来为我们点赞吧！`
				} else {
					title = `${this.mbtiTeam.teamName}队正在邀请${this.mbtiUser.mbti}为我们点赞，快来帮我们完成任务吧！`
				}
			}
			return {
				title: title,
				imageUrl:'',
				path:`/pages/index?page=${params}`
			}
		}
	}
</script>

<style lang="scss" scoped>
.huise{
	filter: grayscale(1);
  pointer-events: none;
}
.page1{
	position: relative;
	overflow: auto;
	height: 1500rpx;
}
.scImage {
	width: 538rpx;
	height: 600rpx;
}
.scImageBox {
	width: 480rpx;
	height: 480rpx;
	position: absolute;
	left: 50%;
	top: 65rpx;
	transform: translate(-50%,0%);
	.scImageContent{
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
		overflow:hidden;
	}
	.make-btn{
		width: 220rpx;
    height: 80rpx;
    position: absolute;
    left: 130rpx;
    top: 460rpx;
	}
	.scImage-video {
		width: 343rpx;
		height: 411rpx!important;
		border-radius: 16rpx;
	}
	.video-box {
		width: 343rpx;
		height: 411rpx!important;
		position: relative;
		margin: auto;
	}
	.item-box {
		position: relative;
		margin-right: 12rpx;
	}
	.scImage-item {
		width: 144rpx;
		height: 144rpx!important;
		border-radius: 16rpx;
		border: 1rpx solid #ccc
	}
	.scImage-add {
		width: 144rpx;
		height: 144rpx!important;
		border-radius: 16rpx;
	}
	.search-name {
		width: 441rpx;
		height: 53rpx;
		border: 1px solid #181818;
		border-radius: 20rpx;
		margin-left: 10rpx;
		text-align: center;
	}
	.canScroll {
		overflow: scroll;
    height: 380rpx;
	}
	.scImage-close {
		width: 38rpx;
		height: 38rpx;
		position: absolute;
		right: 0;
		top: 0;
	}
}
.qdBox {
	.qdImage {
		width: 538rpx;
		height: 800rpx;
	}
	.qd-txt {
		font-style: 36rpx;
		color: #000;
		font-weight: bold;
		position: absolute;
		top: 20rpx;
    left: 130rpx;
	}
	.qdImageBox {
		width: 340rpx;
		height: 70rpx;
		display: flex;
    position: absolute;
    top: 95rpx;
    left: 110rpx;
		.qdImage-item {
			width: 65rpx;
			height: 65rpx!important;
			border-radius: 50%;
			margin-right: 21rpx;
		}
	}
	.qd-day {
		font-style: 36rpx;
		color: #369eff;
		font-weight: bold;
		position: absolute;
    top: 225rpx;
    left: 330rpx;
	}
	.qd-day-box {
		display: flex;
		position: absolute;
    top: 300rpx;
    left: 120rpx;
    width: 400rpx;
		.qd-item {
			width: 82rpx;
			height: 82rpx;
			text-align: center;
			line-height: 82rpx;
			color: #fff;
			font-size: 36rpx;
			margin-right: 40rpx;
			border-radius: 50%;
			border: 1px solid #181818;
			background-color: #919191;
			&.chose {
				background-color: #369eff;
			}
		}
	}
	.qdImage-ok {
		width: 320rpx;
		height: 76rpx;
		position: absolute;
    top: 600rpx;
    left: 110rpx;
	}
	.qdImage-cancel {
		width: 76rpx;
		height: 76rpx;
		position: absolute;
    top: 710rpx;
    left: 230rpx;
	}
}
.rules{
	position: absolute;
	right: 0;
	top: 200rpx;
	width: 90rpx;
	height: 90rpx;
	z-index: 6665;
}
.back_btn {
	position: absolute;
	width: 69rpx;
	height: 87rpx;
	left: 0%;
	top: 105rpx;
}
.go_btn {
	position: absolute;
	width: 259rpx;
	height: 67rpx;
	left: 470rpx;
	top: 725rpx;
}
.dz {
		width: 200rpx;
		height: 44rpx;
		position: absolute;
		top: 1880rpx;
		left: 420rpx;
	}
	.dzImage {
		width: 541rpx;
		height: 414rpx;
	}
	.tk-cancel {
		position: absolute;
    top: 330rpx;
    left: 220rpx;
    width: 76rpx;
    height: 76rpx;
	}
	.tk-cancel2 {
		position: absolute;
    top: 630rpx;
    left: 230rpx;
    width: 76rpx;
    height: 76rpx !important;
    z-index: 666666;
	}
	.tdName {
		width: 100%;
		font-size: 58rpx;
		padding: 0 50rpx;
		color: #fff;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		position: absolute;
		top: 95rpx;
		text-align: center;
	}
	.tdDz {
		font-size: 26rpx;
		color: #fff;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		position: absolute;
		top: 636rpx;
		left: 610rpx;
	}
	.tdPm {
		font-size: 26rpx;
		color: #fff;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		position: absolute;
		top: 680rpx;
		left: 610rpx;
	}
	.mbiImage{
		width: 170rpx;
    height: 54rpx;
    position: absolute;
    top: 430rpx;
    right: 0rpx;
    z-index: 6666;
	}
	.yqImage {
		width: 170rpx;
		height: 54rpx;
		left: 0;
    position: absolute;
	}
	.yqShare {
		width: 170rpx;
    height: 54rpx;
    position: absolute;
    top: 360rpx;
    right: 0rpx;
    z-index: 6666;
    background: transparent;
		&::after {
			border: none!important
		}
	}
	.square{
		width: 100%;
		.top-box {
			width: 100%;
			height: 380rpx;
			padding: 20rpx 35rpx;
			position: absolute;
			top: 200rpx;
		}
		.top-content {
			width: 100%;
			height: 100%;
			display: flex;
			flex-wrap: wrap;
			font-size: 0;
			justify-content: center;
			align-items: center;
		}
		.item-top {
			text-align: center;
			margin-bottom: 15rpx;
			margin-right: 16rpx;
			.item-tag {
				padding: 2rpx;
				border: 1px solid #181818;
				border-radius: 6rpx;
				background-color: #369eff;
				font-size: 18rpx;
				width: 63rpx;
				margin-right: 5rpx;
			}
			.item-tag1 {
				padding: 2rpx;
				border: 1px solid #181818;
				border-radius: 6rpx;
				background-color: #f1ee41;
				font-size: 18rpx;
				width: 73rpx;
			}
			.item-name {
				font-size: 18rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				width: 120rpx;
				text-align: center;
			}
			.pImage{
				width: 80rpx;
				height: 80rpx;
				margin: 5rpx;
				border-radius: 50%;
			}
		}
		.tabs{
			.rw{
				position: absolute;
				top: 661rpx;
				left: 27rpx;
				width: 197rpx;
			}
			.xd{
				position: absolute;
				top: 661rpx;
				left: 219rpx;
				width: 197rpx;
			}
		}
		.tsImage {
			width: 599rpx;
			height: 81rpx;
			position: absolute;
			top: 750rpx;
			left: 50%;
			transform: translate(-50%);
		}
		.wcJd {
			width: 100%;
			position: absolute;
			top: 850rpx;
			.jdName {
				font-size: 24rpx;
				color: #000;
				position: absolute;
				left: 90rpx;
			}
			.jdImage {
				width: 462rpx;
				height: 30rpx;
				position: absolute;
				left: 200rpx;
			}
			.item-jd {
				width: 462rpx;
				height: 26rpx;
				position: absolute;
				left: 203rpx;
				top: 2rpx;
				.item-jdbg {
					height: 100%;
					background-color: #369eff;
					border-radius: 20rpx;
				}
				.item-jdnum {
					font-size: 24rpx;
					color: #000;
					position: absolute;
					top: -5rpx;
				}
			}

		}

		.bottom-box {
			width: 100%;
			height: 1250rpx;
			padding: 30rpx;
			position: absolute;
			top: 910rpx;
			font-size: 0;
			padding-bottom: 200rpx;
			.item-bottom{
				padding: 20rpx;
				box-shadow: 3rpx 10rpx 3rpx 2px rgba(0, 0, 0, 0.05);
				border-radius: 25rpx;
				margin: 30rpx;
			}
		.pImage{
			width: 185rpx;
			height: 185rpx;
			border-radius: 10rpx;
			margin: 1rpx;
    	border: 1rpx solid #ccc;
		}
		.item-name {
			font-size: 30rpx;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			width: 100%;
			text-align: left;
		}
		.item-time {
			font-size: 18rpx;
			color: #3b3b3b;
			text-align: left;
			padding-bottom: 10rpx;
			border-bottom: 1px solid #ccc;
		}
		.item-msg {
			font-size: 28rpx;
			color: #888;
			text-align: left;
			margin: 10rpx 0;
			white-space: pre-line;
		}
		.item-video{
			width: 278rpx;
			height: 305rpx;
			border-radius: 10rpx;
			.my-video {
				width: 328rpx;
				height: 305rpx!important;
			}
		}
		}
		.content{
			position: absolute;
			left: 90rpx;
			width: 580rpx;
			height: 990rpx;
			overflow: auto;
		.item{
			position: relative;
			margin-bottom: 30rpx;
			.xuhao{
				color: #333;
				font-weight: bold;
				font-size: 28rpx;
				position: absolute;
				top: 10rpx;
				background-color: #fffc09;
				padding: 2rpx 4rpx;
				border: 1px solid #181818
			}
			.rwName {
				color: #000;
				font-weight: bold;
				font-size: 30rpx;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
				position: absolute;
				top: 5rpx;
				left: 50rpx;
			}
			.rwDsc {
				color: #000;
				font-size: 21rpx;
				width: 390rpx;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
				position: absolute;
				top: 44rpx;
    		left: 50rpx;
			}
			.itemList{
				width: 431rpx;
				margin-left: 20rpx;
			}
			.dagou{
				position: absolute;
				width: 40rpx;
				z-index: 66;
				top: 0rpx;
    		left: 400rpx;
			}
			.kuang{
				position: absolute;
				width: 44rpx;
				z-index: 65;
				top: 0rpx;
    		left: 400rpx;
			}
			.pingzheng{
				position: absolute;
				width: 87rpx;
				height: 90rpx;
				z-index: 666;
				top: 0rpx;
    		left: 460rpx;
			}
			.pingzhengCon{
				color: #fff;
				font-size: 27rpx;
				padding: 6rpx 18rpx;
				position: absolute;
				width: 87rpx;
				height: 87rpx;
				z-index: 6666;
				top: 0rpx;
    		left: 450rpx;
			}
		}
	}
	}
	.xhImage {
		width: 700rpx;
		height: 120rpx;
		position: fixed;
		bottom: 0rpx;
		left: 50%;
		transform: translate(-50%);
		z-index: 1000;
	}
</style>